<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script>
			
			//页面body加载完之后立刻会调用
			onload = function() {
				
				//通过id
				/*
				var oSave = document.getElementById("save"); //保存按钮
				var oName = document.getElementById("name");
				var oAge = document.getElementById("age");
				var oEdu = document.getElementById("edu");
				var oPro = document.getElementById("pro");
				oSave.onclick = function(){
					console.log("姓名:" + oName.value + ",年龄:" + oAge.value + ",学历:" + oEdu.value + ",专业:" + oPro.value);
				}
				*/
				
				//通过tagName
				/*
				//aInput是一个数组(节点列表)
				var aInput = document.getElementsByTagName("input");
				
				aInput[4].onclick = function() {
					console.log("姓名:" + aInput[0].value + ",年龄:" + aInput[1].value + ",学历:" + aInput[2].value + ",专业:" + aInput[3].value);
				}
				*/
				
				//通过name
				var aInput = document.getElementsByName("name");
				
				aInput[4].onclick = function()  {
					console.log("姓名:" + aInput[0].value + ",年龄:" + aInput[1].value + ",学历:" + aInput[2].value + ",专业:" + aInput[3].value);
				}
				
			}
		</script>
	</head>
	<body>
		<input id="name" type="text" name="name" placeholder="姓名"/>
		<input id="age" type="text" name="name" placeholder="年龄"/>
		<input id="edu" type="text" name="name" placeholder="学历"/>
		<input id="pro" type="text" name="name" placeholder="专业"/>
		<input id="save" type="button" name="name" value="保存" />
	</body>
</html>
